<template>
	<view class="container">
		<image src="/static/bg.png" class="bg" mode=""></image>
		<view class="userAvar">
			<!-- <image src="" mode=""></image> -->
			<view class="topHeacd"></view>
			<view class="biaoti f f-a-c p-l-40">
				<view class="waibOx p-r">
					我的
				</view>
			</view>
		</view>
		<view class="body p-20">
			<view @click="goInfo" class="head f f-a-c f-j-b">
				<view class="lef f f-a-c">
					<image :src="userinfo.avatar||'/static/logo.png'" class="avart" mode=""></image>
					<view class="name m-l-25">
						<view class="nickName">
							{{userinfo.username||'---'}}
						</view>
						<view class="info m-t-10">
							{{userinfo.realname}} | {{userinfo.age}}岁 | {{userinfo.grade}}年级
						</view>
					</view>
				</view>
				<image src="/static/my/you.png" class="rig" mode=""></image>
			</view>
			<!-- 下面的会员 -->
			<view class="vip m-t-30 p-r f f-a-c f-j-c p-20">
				<view class="sanjiao">

				</view>
				<view class="myVip p-l-30 p-r-30">
					<view class="vipTop f f-a-c ">
						<image src="/static/my/v.png" class="vipImg m-r-10" mode=""></image>
						<view class="myVipName m-r-20">
							我的会员
						</view>
						<view v-if="numValue!=1" class="vipTime">
							会员{{String(userinfo.profile.identity_end_at).split(' ')[0]}} 到期
						</view>
					</view>
					<view @click="Remaining" class="dushu f f-a-c ">
						{{numValue==1?'开通会员享受更多权益~':numValue==3?`读书会剩余次数：${userinfo.profile.book_club_num} `:'开通会员享受更多权益~'}}
						<image src="/static/my/you2.png" v-if="numValue!=1" class="jiantou m-l-10" mode=""></image>
					</view>
				</view>
				<!-- ------------------------------------------------------------------------------------------------------------------------------------------------- -->
				<view @click="vipRenewal(1)" v-if="numValue==1" class="renewal">
					会员申请
				</view>
				<view @click="vipRenewal(2)" v-else-if="numValue==3" class="renewal">
					会员续费
				</view>
				<view class="" v-else>
					<view @click="vipRenewal(3)" class="renewals">
						会员升级
					</view>
					<view @click="vipRenewal(2,1)" class="renewalss">
						会员续费
					</view>

				</view>
			</view>
			<!-- /阅读报告 -->
			<view class="readTheReport f f-a-c f-j-b">
				<view @click="reacdThe" class="yue p-20 b-f b-r-20 f f-a-c f-j-b p-t-30 p-b-30 yues">
					<view class="left">
						<view class="report">
							阅读报告
						</view>
						<view class="habit m-t-20">
							查询阅读习惯
						</view>
					</view>
					<image src="/static/my/book.png" class="books" mode=""></image>
				</view>
				<view @click="goLead" class="yue p-20 b-f b-r-20 f f-a-c f-j-b p-t-30 p-b-30">
					<view class="left">
						<view class="report">
							排行榜
						</view>
						<view class="habit m-t-20">
							查询查看阅读排行
						</view>
					</view>
					<image src="/static/my/guan.png" class="books" mode=""></image>
				</view>
			</view>
			<!-- 下面的积分 -->
			<view class="list p-20 b-r-20 b-f m-t-20">
				<view v-for="(item,index) in list" :key="index" @click="integral(index)" class="itemList f f-a-c f-j-b">
					<view class="points f f-a-c">
						<image :src="item.img" class="money m-r-10" mode=""></image>
						<view class="jifen m-l-10">
							{{item.name}}
						</view>
					</view>
					<image src="/static/my/you.png" class="jianto" mode=""></image>
				</view>
			</view>
		</view>
		<u-mask :show="shows">
			<view class="bgs">
				<view class="title">
					推荐二维码
				</view>
				<view class="f f-a-c f-j-c">
					<image :src="imgUrl" class="code" mode=""></image>
				</view>
			</view>
			<!-- /下面的按钮 -->
			<view class="btnWatch">
				<view class="topBtn f f-a-c f-j-c">
					<button @click="shareToWeChat" :plain="true">
						<view class="rigImg f f-a-c f-j-c f-d-c">
							<image src="/static/home/wec.png" class="img" mode=""></image>
							<view class="weCath">
								微信好友
							</view>
						</view>
					</button>
					<button @click.stop="shareToWeChat(imgUrl)" :plain="true">
						<view class="rigImgs f f-a-c f-j-c f-d-c">
							<image src="/static/scher/load.png" class="img" mode=""></image>
							<view class="weCath">
								保存相册
							</view>
						</view>
					</button>
				</view>
				<view class="xian"></view>
				<view @click="shows=false" class="clone">
					关闭
				</view>
			</view>
		</u-mask>
		<u-mask :show="showRenew">
			<view class="cenVip">
				<view class="p-r">
					<image src="/static/cha.png" @click="showRenew=false" class="cha" mode=""></image>
					<view class="tit">
						会员续费
					</view>
					<!--  -->
					<view class="inpVale">
						<image src="/static/money.png" class="time" mode=""></image>
						<input type="text" class="inp" disabled @click="initiate(1)" v-model="value1" placeholder="开始日期"
							name="" id="">
					</view>
					<view class="inpVale">
						<image src="/static/money.png" class="time" mode=""></image>
						<input type="text" class="inp" disabled @click="initiate(2)" v-model="value2" placeholder="结束日期"
							name="" id="">
					</view>
					<!-- 下面的按钮 -->
					<view @click="memberRenewal" class="btn">
						提交
					</view>
					<!-- 下面的记录 -->
					<view @click="spend" class="Records f f-a-c f-j-c">
						会员续费记录 <image src="/static/my/you.png" class="imgRig m-l-10" mode=""></image>
					</view>
				</view>
			</view>
		</u-mask>
		<!-- 这个是时间 -->
		<u-picker @confirm="confirmFn" v-model="showTime" mode="time"></u-picker>
		<!-- 升级会员 -->
		<u-mask :show="showRenewVip">
			<view class="cenVip">
				<view class="p-r">
					<image src="/static/cha.png" @click="showRenewVip=false" class="cha" mode=""></image>
					<view class="tit">
						会员升级
					</view>
					<!--  -->
					<view class="inpVale">
						<view class="f f-a-c f-j-c">
							请确认升级会员
						</view>
					</view>
					<!-- 下面的按钮 -->
					<view @click="membership" class="btn">
						提交
					</view>
					<!-- 下面的记录 -->
					<view @click="Upgrades" class="Records f f-a-c f-j-c">
						会员升级记录 <image src="/static/my/you.png" class="imgRig m-l-10" mode=""></image>
					</view>
				</view>
			</view>
		</u-mask>
		<!-- 这个是自己写的内容 -->
		<!-- 
		   <view>这个是搞得颜色是是是这里是金克斯的主场哎嘿 VUE VUEX VUE-ROUTER REACT REACT-ROUTER REACD PINIA REACT-DOM PAGEA PAGEB PAGEC </view>
		-->
		<!-- 	<view class="dkWord">
			自动导入基础使用结合使用设置页面颜色
		</view>
		<button @click="Ment">会员申请</button>
		<button @click="MentSheng">会员升级</button>
		<button @click="authentication">H5认证</button>
		<button @click="verify_token">获取verify_token</button>
		<button @click="userinfos">指定用户信息上报</button>
		<button @click="faceInterface">获取认证人脸接口</button> -->
	</view>
</template>

<script>
	import UQRCode from '@/uni_modules/Sansnn-uQRCode/js_sdk/uqrcode/uqrcode.js';
	export default {
		data() {
			return {
				imgUrl: '',
				numValue: '',
				showRenewVip: false,
				showTime: false,
				value1: '',
				value2: '',
				num: 0,
				userinfo: uni.getStorageSync('userinfo'),
				showRenew: false,
				shows: false,
				num: 0,
				list: [{
					name: '我的积分',
					img: '/static/my/money.png'
				}, {
					name: '我要推荐',
					img: '/static/my/qun.png'
				}, {
					name: '我的订单',
					img: '/static/my/shu.png'
				}, {
					name: '帮助中心',
					img: '/static/my/my.png'
				}, {
					name: '设置',
					img: '/static/my/zu.png'
				}]
			}
		},
		async onShow() {
			await this.user()
			this.userinfo = uni.getStorageSync('userinfo')
			if (this.userinfo.profile.is_adminer == '0' && this.userinfo.profile.admin_status != '1') {
				this.list = [{
					name: '我的积分',
					img: '/static/my/money.png'
				}, {
					name: '我要推荐',
					img: '/static/my/qun.png'
				}, {
					name: '我的订单',
					img: '/static/my/shu.png'
				}, {
					name: '帮助中心',
					img: '/static/my/my.png'
				}, {
					name: '设置',
					img: '/static/my/zu.png'
				}]
			} else if (this.userinfo.profile.is_adminer != '0' && this.userinfo.profile.admin_status == '1') {
				this.list = [{
					name: '我的积分',
					img: '/static/my/money.png'
				}, {
					name: '我要推荐',
					img: '/static/my/qun.png'
				}, {
					name: '我的订单',
					img: '/static/my/shu.png'
				}, {
					name: '门店管理',
					img: '/static/my/time.png'
				}, {
					name: '帮助中心',
					img: '/static/my/my.png'
				}, {
					name: '设置',
					img: '/static/my/zu.png'
				}]
			}
			this.numValue = uni.getStorageSync('userinfo').profile.identity
		},
		methods: {
			shareToWeChat() {
				wx.downloadFile({
					url: this.imgUrl,
					success: (res) => {

						wx.showShareImageMenu({

							path: res.tempFilePath,
							success: res => {
								this.$msg('保存成功')
							},
							fail: red => {
								this.$msg('保存失败')
							}
						})

					}

				})
				// wx.showShareImageMenu({ //分享给朋友
				// 	path: this.imgUrl,
				// 	success: (res) => {
				// 		console.log("分享成功：", res);
				// 	},
				// 	fail: (err) => {
				// 		console.log("分享取消：", err);
				// 	},
				// })
			},
			baocun(img) {
				console.log('00000000000000000000000000');
				uni.saveImageToPhotosAlbum({
					filePath: img,
					success: (res) => {
						console.log(res, 'save success');
						this.$msg('保存成功')
					},
					fail: (err) => {
						console.log(err, '7777777777777777');
						this.$msg('保存失败')
					}
				});
			},
			//会员续费
			async memberRenewal() {
				if (!this.value1.length || !this.value2.length) return this.$msg('请选择时间')
				let n = await this.$api.Renewals({
					identity_start_at: this.value1,
					identity_end_at: this.value2
				})
				this.$msg(n.message)
				if (n.status) {
					setTimeout(() => {
						this.showRenew = false
					}, 1000)
				}
			},
			// /点击升级会员，确认升级
			async membership() {
				let n = await this.$api.UpgradesSheng()
				this.$msg(n.message)
				if (n.status) {
					setTimeout(() => {
						this.showRenewVip = false
					}, 1000)
				}
			},
			async imgCode() {
				let n = await this.$api.Qrcode()
				this.imgUrl = n.data.url
			},
			// 这个是自己自定义水煮定义的这 都要在半路将他擒下灵气标记
			// 这个是userinfo
			async user() {
				let n = await this.$api.Profile()
				uni.setStorageSync('userinfo', n.data)
				console.log(n.data, '[56565556565565656]');
				this.userinfo = n.data
			},
			// H5认证
			authentication() {
				uni.request({
					url: 'https://aip.baidubce.com/oauth/2.0/token?grant_type=client_credentials&client_id=G1TWiagoXG0vuXGwZzf2LiXj&client_secret=PXMYsL392K0wgCqe1dLyvVzlBGXEHrRN',
					method: 'post',
					data: {
						// grant_type: 'client_credentials',
						// client_id: "G1TWiagoXG0vuXGwZzf2LiXj",
						// client_secret: 'PXMYsL392K0wgCqe1dLyvVzlBGXEHrRN'
					},
					header: {
						'token': uni.getStorageSync('token') || '',
						// "platform": "wxMiniProgram"
					},
					success: res => {
						console.log(res, res.data.access_token, res.data.session_key);
						uni.setStorageSync('access_token', res.data.access_token)
						uni.setStorageSync('session_key', res.data.session_key)
						// 获取verify_token
						// this.verify_token()
					},
					fail: error => {
						reject(error)
					}
				})
			},
			// 获取verify_token
			verify_token() {
				uni.request({
					url: `https://aip.baidubce.com/rpc/2.0/brain/solution/faceprint/verifyToken/generate?access_token=${uni.getStorageSync('access_token')}`,
					method: 'post',
					data: {
						"plan_id": "18289"
					},
					header: {
						"Content-Type": "application/json"
						// "platform": "wxMiniProgram"
					},
					success: res => {
						console.log(res, '122354454');
						uni.setStorageSync('verify_token', res.data.result.verify_token)
						// 获取verify_token 1111111111111111111111111111111111111111111111111111

					},
					fail: error => {
						reject(error)
					}
				})
			},
			userinfos() {
				uni.request({
					url: `https://brain.baidu.com/solution/faceprint/idcard/submit`,
					method: 'post',
					data: {
						"verify_token": uni.getStorageSync('verify_token'),
						"id_name": '刘振零',
						"id_no": "341204200108151671",
						"certificate_type": "0"
					},
					header: {
						"Content-Type": "application/json"
						// "platform": "wxMiniProgram"
					},
					success: res => {
						console.log(res, '122354454');
						// 获取verify_token 1111111111111111111111111111111111111111111111111111

					},
					fail: error => {
						reject(error)
					}
				})
			},
			// 获取人脸认证url
			faceInterface() {
				uni.navigateTo({
					url: '/pages/my/WebView'
				})
				// uni.request({
				// 	url: `https://brain.baidu.com/face/print/?token=${uni.getStorageSync('verify_token')}&successUrl=https://www.baidu.com&failedUrl=https://www.baidu.com`,
				// 	method: 'post',

				// 	header: {
				// 		"Content-Type": "application/json"
				// 		// "platform": "wxMiniProgram"
				// 	},
				// 	success: res => {
				// 		console.log(res, '122354454');
				// 		// 获取verify_token 1111111111111111111111111111111111111111111111111111
				// 	},
				// 	fail: error => {
				// 		reject(error)
				// 	}
				// })
			},
			// -------------------------------------------------------------------------------------------------------
			// 会员升级记录
			Upgrades() {
				uni.navigateTo({
					url: '/pageA/MemberUpgradeRecord'
				})
			},
			//点击跳转到会员申请
			Ment() {
				uni.navigateTo({
					url: '/pageA/MembershipApplication'
				})
			},
			// 会员升级
			MentSheng() {
				this.showRenewVip = true
			},
			// 点击跳转读书会剩余次数
			Remaining() {
				uni.navigateTo({
					url: '/pageA/ClubReadings'
				})
			},
			// /点击会员续费记录
			spend() {
				this.showRenew = false
				uni.navigateTo({
					url: '/pageA/SpendingRecord'
				})
			},
			// 时间
			initiate(num) {
				if (num == 1) {
					this.num = 1
					this.showTime = true
				} else if (num == 2) {
					this.num = 2
					this.showTime = true
				}
			},
			// /会员续费
			vipRenewal(num) {
				if (num == 1) {
					// 会员申请
					uni.navigateTo({
						url: '/pageA/MembershipApplication'
					})
				} else if (num == 2) {
					// 会员续费
					this.showRenew = true
				} else if (num == 3) {
					// 会员升级
					this.showRenewVip = true
				}
			},
			// 这个是时间选择
			confirmFn(e) {
				if (this.num == 1) {
					this.value1 = e.year + '-' + e.month + '-' + e.day
				} else if (this.num == 2) {
					this.value2 = e.year + '-' + e.month + '-' + e.day
				}
				console.log(e);
			},
			// /跳转到我的积分
			integral(num) {
				if (this.userinfo.profile.is_adminer == '0') {
					if (num == 0) {
						uni.navigateTo({
							url: '/pageA/MyIntegral'
						})
					} else if (num == 1) {
						this.imgCode()
						// 这个是我要推荐
						this.shows = true
					} else if (num == 2) {
						// 跳转我的订单
						uni.navigateTo({
							url: '/pageB/myOrder'
						})
					} else if (num == 3) {
						uni.navigateTo({
							url: '/pageC/HelpCenter'
						})
					} else if (num == 4) {
						uni.navigateTo({
							url: '/pageC/Setting'
						})
					}
				} else {
					if (num == 0) {
						uni.navigateTo({
							url: '/pageA/MyIntegral'
						})

					} else if (num == 1) {
						this.imgCode()
						// 这个是我要推荐
						this.shows = true
					} else if (num == 2) {
						// 跳转我的订单
						uni.navigateTo({
							url: '/pageB/myOrder'
						})
					} else if (num == 3) {
						uni.navigateTo({
							url: '/pageB/StoreManagement'
						})
					} else if (num == 4) {
						uni.navigateTo({
							url: '/pageC/HelpCenter'
						})
					} else if (num == 5) {
						uni.navigateTo({
							url: '/pageC/Setting'
						})
					}

				}
			},
			// /跳转到个人中心
			goInfo() {
				uni.navigateTo({
					url: '/pageA/userrInfo'
				})
			},
			// 跳转到阅读报告
			reacdThe() {
				uni.navigateTo({
					url: '/pageA/ReadTheReport'
				})
			},
			//跳转排行榜
			goLead() {
				uni.navigateTo({
					url: '/pageA/Leaderboard'
				})
			}
		}
	}
</script>

<style scoped lang="scss">
	.cha {
		width: 46rpx;
		height: 46rpx;
		position: absolute;
		top: -80rpx;
		right: 0;
	}

	.Records {
		font-size: 24rpx;
		font-family: PingFang SC, PingFang SC-Regular;
		font-weight: 400;
		text-align: center;
		color: #999999;
		margin-top: 20rpx;

		.imgRig {
			width: 10rpx;
			height: 18rpx;
		}
	}

	.inpVale {
		position: relative;
		width: 90%;
		height: 80rpx;
		border-radius: 20rpx;
		// background-color: pink;
		margin: 0 auto;
		box-sizing: border-box;
		margin-top: 25rpx;
		margin-bottom: 25rpx;

		.time {
			position: absolute;
			width: 28rpx;
			height: 28rpx;
			right: 20rpx;
			top: 50%;
			transform: translateY(-50%);

		}

		.inp {
			height: 80rpx;
			width: 100%;
			border: 2rpx solid #dedede;
			border-radius: 20rpx;
			box-sizing: border-box;
			padding-left: 20rpx;
		}
	}

	.cenVip {
		position: absolute;
		width: 70%;
		top: 50%;
		left: 50%;
		border-radius: 15rpx;
		transform: translate(-50%, -50%);
		padding: 20rpx;
		background-color: #fff;

		.btn {
			margin: 0 auto;
			width: 90%;
			height: 80rpx;
			background: #009d85;
			border-radius: 40rpx;
			text-align: center;
			line-height: 80rpx;
			font-size: 28rpx;
			font-family: PingFang SC, PingFang SC-Bold;
			font-weight: 700;
			color: #ffffff;
			margin-top: 50rpx;
		}

		.tit {
			font-size: 32rpx;
			font-family: PingFang SC, PingFang SC-Bold;
			font-weight: 700;
			text-align: center;
			color: #333333;
		}
	}

	button {
		border: none;
		padding: 0%;
		margin: 0;
	}

	.btnWatch {
		position: absolute;
		width: 100%;
		height: 300rpx;
		background: #f6f6f6;
		border-radius: 16rpx 16rpx 0rpx 0rpx !important;
		bottom: 0;
		left: 0;
		padding-top: 25rpx;

		.clone {
			text-align: center;
			font-size: 24rpx;
			font-family: PingFang SC, PingFang SC-Regular;
			font-weight: 400;
			text-align: center;
			color: #999999;
			margin-top: 25rpx;
		}

		.xian {
			width: 100%;
			height: 1rpx;
			border: 2rpx solid #e6e6e6;
			margin-top: 10rpx;
		}

		.weCath {
			font-size: 22rpx;
			font-family: PingFang SC, PingFang SC-Regular;
			font-weight: 400;
			text-align: center;
			color: #333333;
		}

		.rigImgs {
			margin-left: 150rpx;
		}

		.img {
			width: 96rpx;
			height: 96rpx;
		}
	}

	.bgs {
		position: absolute;
		width: 70%;
		top: 40%;
		left: 50%;
		border-radius: 20rpx;
		transform: translate(-50%, -50%);
		padding: 20rpx;
		background-color: #fff;

		.title {
			font-size: 32rpx;
			font-family: PingFang SC, PingFang SC-Bold;
			font-weight: 700;
			text-align: center;
			margin-bottom: 25rpx;
			color: #1a1a1a;
		}

		.code {
			width: 470rpx;
			height: 464rpx;
		}
	}

	.list {
		width: 100%;

		.itemList {
			padding-bottom: 30rpx;
			border-bottom: 2rpx solid #f4f4f4;
			margin-bottom: 40rpx;


		}

		.jianto {
			width: 12rpx;
			height: 22rpx;
		}

		.jifen {
			font-size: 28rpx;
			font-family: PingFang SC, PingFang SC-Regular;
			font-weight: 400;
			color: #333333;
		}

		.money {
			width: 42rpx;
			height: 38rpx;
		}
	}

	.itemList:last-child {
		border: none;
		margin-bottom: 0rpx;
	}

	.readTheReport {
		width: 100%;


		.yue {
			width: 49%;

			.books {
				width: 50rpx;
				height: 42rpx;
			}

			.habit {
				font-size: 24rpx;
				font-family: PingFang SC, PingFang SC-Regular;
				font-weight: 400;
				color: #999999;
			}

			.report {
				font-size: 32rpx;
				font-family: PingFang SC, PingFang SC-Bold;
				font-weight: 700;
				color: #333333;
			}
		}

		.yues {
			margin-right: 1%;
		}
	}

	.renewal {
		width: 180rpx;
		height: 64rpx;
		line-height: 64rpx;
		background: linear-gradient(90deg, #ffe5c1, #fdcc8a);
		border-radius: 32rpx;
		font-size: 28rpx;
		font-family: PingFang SC, PingFang SC-Bold;
		font-weight: 700;
		text-align: center;
		color: #9b7234;
	}

	.renewals {
		width: 160rpx;
		height: 50rpx;
		line-height: 50rpx;
		background: linear-gradient(90deg, #ffe5c1, #fdcc8a);
		border-radius: 32rpx;
		font-size: 24rpx;
		font-family: PingFang SC, PingFang SC-Bold;
		font-weight: 600;
		text-align: center;
		color: #9b7234;
	}

	.renewalss {
		width: 160rpx;
		height: 50rpx;
		line-height: 50rpx;
		border: 2rpx solid #FDCF91;
		border-radius: 32rpx;
		font-size: 24rpx;
		font-family: PingFang SC, PingFang SC-Bold;
		font-weight: 600;
		text-align: center;
		color: #FDD39A;
		margin-top: 10rpx;
	}

	.jiantou {
		width: 9rpx;
		height: 15rpx;
	}

	.dushu {
		font-size: 24rpx;
		font-family: PingFang SC, PingFang SC-Regular;
		font-weight: 400;
		color: #b5b5b5;
		margin-left: 50rpx;
		margin-top: 10rpx;
	}

	.vipTime {
		font-size: 22rpx;
		font-family: PingFang SC, PingFang SC-Regular;
		font-weight: 400;
		color: #fdd7a0;
	}

	.myVipName {
		font-size: 32rpx;
		font-family: PingFang SC, PingFang SC-Heavy;
		font-weight: 800;
		color: #fdd7a0;
	}

	.vipImg {
		width: 34rpx;
		height: 28rpx;
	}

	.myVip {
		width: 100%;
	}

	.sanjiao {
		position: absolute;
		height: 0%;
		width: 0;
		border: 28rpx solid #342f38;
		border-left: 28rpx solid transparent;
		border-right: 28rpx solid transparent;
		border-bottom: 28rpx solid transparent;
		bottom: -54rpx;
		left: 50%;
		transform: translateX(-50%);
	}

	.vip {
		height: 130rpx;
		width: 100%;
		border-radius: 32rpx 32rpx 0rpx 0rpx;
		background-color: #342f38;
		margin-bottom: 50rpx;
	}

	.head {
		position: relative;
		z-index: 99999;
		width: 100%;
		height: 125rpx;

		.rig {
			position: relative;
			z-index: 1;
			width: 16rpx;
			height: 30rpx;
		}

		.avart {
			width: 124rpx;
			height: 124rpx;
			border-radius: 50%;
		}

		.info {
			font-size: 26rpx;
			font-family: PingFang SC, PingFang SC-Regular;
			font-weight: 400;
			color: #999999;
		}

		.nickName {
			font-size: 32rpx;
			font-family: PingFang SC, PingFang SC-Bold;
			font-weight: 700;
			color: #333333;
		}
	}

	.body {
		height: calc(100vh - 180rpx);
		overflow-y: auto;
		background-color: #f9f9f9;
	}

	.bg {
		position: absolute;
		top: 0;
		left: 0;
		z-index: 1;
		width: 100%;
		height: 338rpx;
	}

	.userAvar {
		position: fixed;
		top: 0%;
		left: 0;
		height: 180rpx;
		width: 100%;
		// background-color: #fff;
		z-index: 99;
	}

	.topHeacd {
		height: 70rpx;
	}

	.biaoti {
		height: 90rpx;
		width: 100%;

		// background-color: pink;
		.inp {
			width: 100%;
			height: 72rpx;
			background: #ffffff;
			border-radius: 36rpx;
			padding-left: 50rpx;
		}

	}

	.waibOx {
		width: 60%;
		font-size: 30rpx;
		font-weight: 700;
	}

	.container {
		height: 100vh;
		width: 100%;
		padding-top: 180rpx;
		overflow-y: auto;
	}
</style>